<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="{:$system[keywords]}">
<meta name="description" content="{:$system[description]}">
<title>{:$sitetitle}</title>
<link href="file:///E|/desktop/en/images/style.css" rel="stylesheet" type="text/css">
<link href="file:///E|/desktop/en/images/tabb.css" rel="stylesheet" type="text/css">

<script language="javascript" type="text/javascript" src="file:///E|/desktop/en/images/tab.js"></script>
</head>
<!-- inc:inc.js -->
<script type="text/javascript" src="file:///E|/desktop/en/js/jquery.DB_gallery.js"></script>
<script type="text/javascript" charset="utf-8">
  $(function(){
    $(".overview2 a").click(function() {
      if ($(this).hasClass("active2")) { return false; }
     	 var url = $(this).attr("href").replace("_t", "");
     	var namepro = $(this).attr("name").replace("_t", "");

      	var wrap = $("#img-wrap2");
      	var img = new Image();

    
      	img.onload = function() {
      
		$("#note_otherimg2").html(namepro);
        wrap.find("img").attr("src", url);
		
      };

      img.src = url;
      $(".overview2 a").removeClass("active2");
      $(this).addClass("active2");
      return false;

    }).filter(":first").click();
  });
    

  </script>
  
  <script type="text/javascript" charset="utf-8">
$(function(){
		
	 $("a#right_btn").click(function(event) {
	 	event.preventDefault();  
		var Lilen = parseInt($(".overview2 li").length);
		
		var $find = $(".overview2").find("a.active2");
		var Active_Id = parseInt($find.parent("li").attr("id")) + 1;
		if(Active_Id > Lilen){return false;}else{$("#"+Active_Id+" a").click();}

		return false;
	 });
		
 });
    
$(function(){
		
	 $("a#left_btn").click(function(event) {
		event.preventDefault();  

		var $find = $(".overview2").find("a.active2");
		var Active_Id = parseInt($find.parent("li").attr("id")) - 1;
		if(Active_Id == 0){return false;}else{$("#"+Active_Id+" a").click();}

		return false;
	 });
		
 });
</script>
<body>
<!-- inc:inc.header -->


<div id="innerwarpper">
		<div id="pages_container">
				<div id="title_inner">
					<span>{:$subject}</span>
					<div class="infro"><a href="file:///E|/desktop/en/index.php">Home</a> > <a href="file:///E|/desktop/en/products.php">Products</a> > {:$subject}</div>
				</div>
				
				<div id="container">
					<div id="pages_content">
			  
  <table width="100%" border="0"  cellpadding="0" cellspacing="0">



<tr>
	<td align="left" valign="top" style="padding:10px 0; border-bottom:4px solid #f5f5f5;"><span class="font_pro_name">{:$rs[subject_en]}</span></td>
</tr>
<tr>
<td align="left"  valign="top" style="padding-top:15px;" >
			
				<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>
<td align="center" colspan="5" valign="top" ><table width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top:1px;">
          <tr>
            <td height="24" align="left" valign="bottom" >
			<table width="100%" border="0" cellspacing="0" cellpadding="0" class="fod1 mu6">
              <tr>
			  <!-- if($rs[cateid]!=40) -->
                <td width="179" align="center" valign="middle" class="s" onMouseover="fod(this,'fodc4')" style="font-size:12px;">Application Scope</td>
                <td width="179" align="center" valign="middle" onMouseover="fod(this,'fodc4')" style="font-size:12px;">Characteristics</td>
				<!-- end -->
                <td width="179" align="center" valign="middle" <!-- if($rs[cateid]==40) -->class="s"<!-- end --> onMouseover="fod(this,'fodc4')" style="font-size:12px; cursor:pointer;">Successful Project Example</td>
              </tr>
            </table></td>
          </tr>
          <tr>
            <td align="left" valign="top" >
<style>
#fodc4 table{ border-top:1px solid #cccccc;border-left:1px solid #cccccc;}
#fodc4 td{ border:1px solid #cccccc; border-top:none; border-left:0; padding:3px;}

#DB_gallery ul, #DB_gallery li{list-style:none;margin:0;padding:0}
#DB_gallery img{border:none;vertical-align:top;}

#DB_gallery .DB_thumSet .DB_thumMove li a img{ width:110px; height:73px;}

#DB_gallery .DB_imgSet {position:relative;width:716px; margin:0 auto;height:478px;overflow:hidden;}
#DB_gallery .DB_imgSet .DB_imgWin{height:100%}
#DB_gallery .DB_imgSet .DB_page{position:absolute;bottom:0;font:11px tahoma bold;padding:5px;color:#ffffff; font-weight:bold; font-size:14px;}
#DB_gallery .DB_imgSet .DB_page {height:30px; background:#000; opacity:0.7; position:absolute; bottom:0; color:#fff; width:100%; padding-left:20px; line-height:30px;}
#DB_gallery .DB_imgSet .DB_prevBtn{position:absolute;top:50%;margin-top:-45px;cursor:pointer;left:0;}
#DB_gallery .DB_imgSet .DB_nextBtn{position:absolute;top:50%;margin-top:-45px;cursor:pointer;right:0;}

#DB_gallery .DB_thumSet {position:relative;margin-top:10px;width:716px;overflow:hidden; margin:0 auto;}
#DB_gallery .DB_thumSet .DB_thumMove{position:relative;white-space:nowrap;font-size:0}
#DB_gallery .DB_thumSet .DB_thumMove li{display:inline;margin-right:8px}
#DB_gallery .DB_thumSet .DB_prevPageBtn{position:absolute;top:0;cursor:pointer;left:0;}
#DB_gallery .DB_thumSet .DB_nextPageBtn{position:absolute;top:0;cursor:pointer;right:0;}
#DB_gallery .DB_thumSet .DB_thumLine{position:absolute;width:100px;height:63px;border:5px solid #3B322D;left:0;top:0}
a#left_btn{ width:65px; height:80px; position:absolute; margin-left:10px; display:block; margin-top:180px; background:url(images/left_btn.png) no-repeat top left; z-index:9999;}
a#right_btn{ width:65px; height:80px; position:absolute; margin-left:620px; display:block; margin-top:180px; background:url(images/right_btn.png) no-repeat top left; z-index:9999;}
.overview2 li a img{ border:5px solid #fff; width:100px; height:63px;}
.overview2 li a.active2 img{ border:5px solid #3B322D;}
</style>
			<div id="fodc4" style="padding:15px 8px;border:1px solid #efefef; margin-top:1px; width:984px; margin-left:1px; font-size:12px;">
				
				
			  <!-- if($rs[cateid]!=40) -->
              <div class="dis" name="f"> 
				{:$content_new4}&nbsp;
				</div>
              <div class="undis" name="f">
			  	{:$content_en}&nbsp;
				  </div>
				  <!-- end -->
              <!--<div class="undis" name="f">
			  	{:$content_new2}&nbsp;
                </div>-->
              <div class="<!-- if($rs[cateid]!=40) -->un<!-- end -->dis" name="f">

<div id="DB_gallery">

	<div class="DB_imgSet">
		<a href="#" id="left_btn"></a>
		<a href="#" id="right_btn"></a>
		<div id="img-wrap2" class="DB_imgWin"><img src="{:$folder}{:$markfile}" border="0" width="716" height="473"></div>

		<div id="note_otherimg2" class="DB_page" style="font-size:14px;">{:$rs[subject]}</div>
        
	</div>

	<div class="DB_thumSet">

		<ul class="DB_thumMove overview2">

			<li id="1"><a href="{:$folder}{:$markfile}" name="{:$rs[subject]}"  class="active2"><img src="{:$folder}{:$markfile}" /></a></li>
            <!-- run:$cateaddtion = QGMOD_ADDITON_ALL("$id","products","100") -->
			<!-- $cateaddtion AS $key=>$value2 -->
            <li id="{:$value2[row_index]}"><a href="{:$value2[photourldetail]}" name="{:$value2[subject_en]}" ><img src="{:$value2[photourldetail]}" /></a></li>
			<!-- end -->
            <!-- run:unset($cateaddtion) -->

		</ul>

		<div class="DB_thumLine" style=" display:none;"></div>

		<div class="DB_prevPageBtn"><img src="file:///E|/desktop/en/images/prev_page.png" alt="上一页"/></div>

		<div class="DB_nextPageBtn"><img src="file:///E|/desktop/en/images/next_page.png" alt="下一页"/></div>


	</div>



</div>

<script type="text/javascript">

	$('#DB_gallery').DB_gallery({

		thumWidth:110,            

		thumGap:8,                

		thumMoveStep:4,           

		moveSpeed:300,            

		fadeSpeed:500            

	});

</script>
                
              </div>
    
				
				
					</div>
						
			</td>
          </tr>
        </table></td>
</tr>
</table>
			</td>
</tr>
</table>
<div class="backtop"><a href="products.php?id={:$fid}&fid={:$fid}">Back Series</a></div>
				
				
			  </div>
				</div>
		</div>
</div>


<!-- inc:inc.footer -->

</body>
</html>
